<template>
	<div class="layout-padding fillings-container" v-loading="loading">
		<HyTable
			:tableConfig="tableConfig"
			:tableColumns="tableColumns"
			:searchFields="searchFields"
			:searchDefault="searchDefault"
			:searchConfig="searchConfig"
			:buttonConfig="{
				span: 4,
				offset: 1,
			}"
			ref="hyTableRef"
		>
			<template #tableHeader>
				<el-button plain icon="download" @click="handleExport">导出</el-button>
			</template>
			<template #stateSlot="{ row, column }">
				<el-tag :class="setColor(row.country_opinion_status)">{{ formatStatus(row.country_opinion_status) }}</el-tag>
			</template>
			<template #operation>
				<el-table-column fixed="right" label="操作" width="130">
					<template #default="{ row }">
						<el-button text type="primary" icon="View" @click="showDetails(row, '查看')"> 查看 </el-button>
						<el-button
							icon="Reading"
							text
							type="danger"
							@click="showDetails(row, '撤回')"
							:disabled="
								!(row.country_opinion_status == 2 && row.county_push_status != 3 && row.county_push_status != 4 && row.county_push_status != 5)
							"
						>
							撤回
						</el-button>
					</template>
				</el-table-column>
			</template>
		</HyTable>
	</div>
</template>

<script lang="ts">
import { ElMessageBox, ElMessage } from 'element-plus';
import { defineComponent, computed, toRaw } from 'vue';
import { getCountyDeclareList, returnTask, exportExcel, isExsitById, pushDeptDelete } from '/@/api/areaDigital';
import HyTable from '/@/components/HyTable/components/TableLayout/default.vue';
import { useRouter } from 'vue-router';
import { useDict } from '/@/hooks/dict';
import { handleBlobFile } from '/@/utils/other';
import { revocation } from '@cqdcg/admin/views/flow/task/revocation';

export default defineComponent({
	name: 'index',
	components: { HyTable },
	setup() {
		const hyTableRef = ref();
		const router = useRouter();
		const loading = ref(false);
		const { country_opinion_status: OPIN_STATUS } = useDict('country_opinion_status');
		const searchDefault = ref({
			selectType: 3,
		});
		const tableColumns = computed(() => {
			return [
				{ prop: 'app_code', label: '数字化应用编号' },
				{ prop: 'app_name', label: '数字化应用名称' },
				{ prop: 'county_name_name', label: '区县名称' },
				{ prop: 'county_responsible_dept_name', label: '区县责任部门' },
				{ prop: 'county_lead_dept_name', label: '市级牵头部门' },
				{ prop: 'create_time', label: '提交时间' },
				{
					prop: 'country_approve_status_name',
					label: '状态',
					slot: 'stateSlot',
					fixed: 'right',
					width: 160,
				},
			];
		});
		const tableConfig = computed(() => {
			return {
				request: getCountyDeclareList,
				showSearch: true,
				isCostomTop: false,
				title: '数字化应用备案意见回复',
				defaultData: [],
			};
		});
		// 配置搜索
		const searchFields = computed(() => {
			return {
				countyNameName: {
					type: 'input',
					label: '区县名称',
					span: 8,
					placeholder: '请输入区县名称',
				},
				countryOpinionStatus: {
					type: 'select',
					label: '状态',
					span: 8,
					placeholder: '请选择状态',
					options: OPIN_STATUS.value,
				},
				timeArr: {
					type: 'date',
					span: 8,
					picker: 'datetimerange',
					label: '提交时间',
				},
			};
		});
		const searchConfig = computed(() => {
			return {
				labelWidth: '120px',
				span: 6,
				offset: 0,
				type: 'search',
				title: '数字化应用备案意见回复',
				show: true,
			};
		});

		async function showDetails(row, type) {
			const result = await checkData(row.declare_id, type == '撤回' ? 3 : '');
			if (result) {
				console.log(row, type);
				switch (type) {
					case '查看':
						router.push({
							name: '查看',
							query: {
								id: row.declare_id,
								processInstanceId: row.process_instance_id,
								nodeId: row.node_id,
								taskId: row.task_id,
								approveStatus: row.approve_status,
								pageType: 3,
								title: '数字化应用备案详情',
							},
						});
						break;
					case '撤回':
						// ElMessageBox.confirm('确定撤回吗？',
						// '撤回确认',
						// {
						//   confirmButtonText: '确定',
						//   cancelButtonText: '取消'
						// }).then(() => {
						//   loading.value = true
						//   returnTask({
						//     processInstanceId:row.process_instance_id,
						//     // nodeId:row.node_id,
						//     // taskId:row.task_id,
						//     // paramMap:{
						//     //   appCode:row.app_code,
						//     //   returnFlag:3
						//     // }
						//   }).then(res=>{
						//     if(res.ok){
						//       ElMessage.success('操作成功')
						//       hyTableRef.value.getTableData()
						//     }else{
						//       ElMessage.error(res.msg)
						//     }
						//   }).finally(()=>{
						//     loading.value = false
						//   })
						// })
						loading.value = false;
						let obj = {
							processInstanceId: row.process_instance_id,
						};
						revocation(obj)
							.then((res: any) => {
								console.log('撤回接口成功回调');
								hyTableRef.value.getTableData();
								// pushDeptDelete({ businessKey: row.declare_id }).then((res) => {
								// 	if (res.ok) {
								// 		hyTableRef.value.getTableData();
								// 	}
								// });
							})
							.catch((err: any) => {
								console.log('取消弹框和失败回调');
							});
						break;
				}
			}
		}
		type checkParams = {
			declareId: string;
			checkFlag?: number | string;
		};
		function checkData(declareId: string, flag?: number | string) {
			//判断数据是否存在
			if (!loading.value) {
				loading.value = true;
			}
			let params: checkParams = { declareId: declareId };
			if (flag) {
				params['checkFlag'] = flag;
			}
			return new Promise((resolve) => {
				isExsitById(params).then((res) => {
					if (res.ok) {
						if (res.data) {
							resolve(true);
						} else {
							loading.value = false;
							ElMessage.error('该数据已被删除');
							hyTableRef.value.getTableData();
						}
					} else {
						loading.value = false;
						ElMessage.error(res.msg);
						resolve(false);
					}
				});
			});
		}
		function formatStatus(val) {
			const rowArr = OPIN_STATUS.value.filter((item) => item.value == val);
			return rowArr.length && rowArr[0].label;
		}
		function handleExport() {
			let params = hyTableRef.value.getSearchData();
			params['beginTime'] = params['timeArr'] ? params['timeArr'][0] : undefined;
			params['endTime'] = params['timeArr'] ? params['timeArr'][1] : undefined;
			delete params.timeArr;
			console.log(params);
			loading.value = true;
			exportExcel(params)
				.then((res) => {
					loading.value = false;
					handleBlobFile(res, '数字化应用备案意见回复.xlsx');
				})
				.catch(() => {
					loading.value = false;
				});
		}

		//设置颜色
		function setColor(type: string) {
			switch (type) {
				case '1':
					return 'start-tag'; //待审核
				case '2':
					return 'agree-tag'; //已通过
				case '3':
					return 'refuse-tag'; //未通过
				default:
					break;
			}
		}
		return {
			loading,
			hyTableRef,
			tableColumns,
			tableConfig,
			searchFields,
			searchDefault,
			searchConfig,
			showDetails,
			formatStatus,
			handleExport,
			setColor,
		};
	},
});
</script>

<style scoped lang="scss">
.fillings-container {
	height: auto;
}
</style>
